@import "./base.less";
//reset样式
* {
    box-sizing: border-box;
}
[v-cloak] {
    display: none;
}
blockquote,
body,
button,
dd,
dl,
dt,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
input,
legend,
li,
ol,
p,
pre,
td,
textarea,
th,
ul {
    margin: 0 ;
    padding: 0 ;
}
html,body {
    -webkit-font-smoothing: antialiased; //是字体变得清晰
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); //去掉点击链接和文本框对象时默认的灰色半透明覆盖层(iOS)或者虚框(Android)
}
button:focus{
    outline: none;
}
ol,
ul {
    list-style: none;
}

li {
    list-style-type: none;
}

a {
    text-decoration: none;
    &:hover{
       text-decoration: none; 
    }
}

//表格开始
table {
    border-collapse: collapse;
    border-spacing: 0;
}
//表格结束

//表单开始
input {
    outline: none !important;
    -webkit-appearance: none !important;
    border: none ;
    background:none;
    box-shadow:none; 
    &:focus{
        outline: none ;
        -webkit-appearance: none ;
        border-color:transparent ;
    }
}

//搜索框样式
input[type=search]::-webkit-search-cancel-button{
    -webkit-appearance: none;
}


//表单结束


//通用class

.clear {
    clear: both;
}

.bold {
    font-weight: bold;
}

.clearfix {
    *zoom: 1
}

.price_tab{
    color: #ff9840;
}
.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

.clearfix:before,
.clearfix:after {
    display: table;
    content: "";
    line-height: 0
}

.clearfix:after {
    clear: both
}

.overflow{
    &:after{
        content: '';
        display: block;
        clear: both;
    }
}

.no-hover{
    pointer-events:none;
}
.hover{
    cursor: pointer;
}
.rows {
    display: flex;
    >div{
        flex: 1;
    }
    .one,
    .two {
        width: 50%;
    }
}

.one-line{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap !important;
    word-break: keep-all !important;
}

.hide {
    display: none;
}

.fl {
    float: left;
}

.fr {
    float: right;
}

.slideInUp {
    animation: slideInUp .3s;
}

@keyframes slideInUp {
    from {
        transform: translate3d(0, 100%, 0)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

// 边框
.border-1px(@color) {
    position: relative;
    &:before {
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        //      border-top: 1px solid @color ;
        border-top: 1px solid darken(#f4f4f4, 20%);
        content: ' ';
    }
}

@media (-webkit-min-device-pixel-ratio: 1.5),
(min-device-pixel-ratio: 1.5) {
    .border-1px {
        &::before {
            -webkit-transform: scaleY(0.7);
            transform: scaleY(0.7);
        }
    }
    .border-top {
        &::after {
            -webkit-transform: scaleY(0.7);
            transform: scaleY(0.7);
        }
    }
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-device-pixel-ratio: 2) {
    .border-1px {
        &::before {
            -webkit-transform: scaleY(0.5);
            transform: scaleY(0.5);
        }
    }
    .border-top {
        &::after {
            -webkit-transform: scaleY(0.5);
            transform: scaleY(0.5);
        }
    }
}

@media (-webkit-min-device-pixel-ratio: 3),
(min-device-pixel-ratio: 3) {
    .border-1px {
        &::before {
            -webkit-transform: scaleY(0.34);
            transform: scaleY(0.34);
        }
    }
    .border-top {
        &::after {
            -webkit-transform: scaleY(0.34);
            transform: scaleY(0.34);
        }
    }
}
/*弹性布局兼容性*/

.flex_row {
    //横向
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.flex_colum {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.my_flex {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}


/*横向between*/

.my_flex_between {
    justify-content: space-between;
    align-items: center;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.my_flex_center {
    /*推荐*/
    justify-content: center;
    align-items: center;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}


/*横向around*/

.my_flex_around {
    /*推荐*/
    justify-content: space-around;
    align-items: center;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.my_flex_right {
    /*推荐*/
    justify-content: flex-end;
    align-items: center;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.my_flex_left {
    /*推荐*/
    justify-content: flex-start;
    align-items: center;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}


/*纵向between*/

.my_flex_col_betweenn {
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}


/*纵向center*/

.my_flex_col_center {
    justify-content: center;
    align-items: center;
    flex-direction: column;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.my_flex_col_around {
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;
    /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Chrome */
    display: flex;
    /* NEW, Spec - Opera 12.1, Firefox 20+ */
}



